<template>
  <div class="app-container org">
    <el-card class="leftCard">
      <!-- 搜索条件盒子 -->
      <div>
        <p class="pinformation">搜索条件</p>
        <el-form :model="queryParams" ref="queryRef" label-width="80px" @submit.native.prevent>
          <el-row>
            <el-col :span="16">
              <el-form-item label="编号名称：" prop="serialName">
                <el-input v-model="queryParams.serialName" placeholder="请输入编号名称" clearable @keyup.enter="handleQuery" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-row justify="end">
                <el-button type="success" icon="Search" @click="handleQuery">搜索</el-button>
                <el-button icon="Refresh" @click="resetQuery">重置</el-button>
              </el-row>
            </el-col>
          </el-row>
        </el-form>
      </div>

      <div>
        <el-row style="justify-content: space-between">
          <el-row>
            <p class="pinformation">编号列表</p>
            <p class="totalStyle">共 {{ total }} 条数据</p>
          </el-row>
          <div>
            <el-button type="success" link icon="Plus" @click="handeleAdd">新增</el-button>
            <el-button type="success" link icon="Delete" @click="handleDelete"
              :disabled="multiple > 0 ? false : true">删除</el-button>
          </div>
        </el-row>

        <el-table class="business" ref="mainTableRef" v-loading="loading" :data="serialTable" @row-click="rowClick"
          :row-class-name="tableRowClass" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55" align="center" />
          <el-table-column label="编号名称" align="center" prop="serialName" />
          <el-table-column label="创建人" align="center" prop="createUserName" />
          <el-table-column label="创建时间" align="center" prop="createTime" />
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template #default="scope">
              <el-button link type="success" icon="Delete" @click="handleDelete(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="change">
          <el-pagination v-show="total > 0" :total="total" :page-sizes="[10, 20, 30, 50]"
            v-model:current-page="queryParams.pageNum" v-model:page-size="queryParams.pageSize"
            layout="total, sizes, prev, pager, next, jumper" @pagination="getList" style="margin-top: 20px"
            :pager-count="5" @size-change="getList" @current-change="getList" />
        </div>
      </div>
    </el-card>

    <el-card class="rightCard">
      <!-- 基础信息 -->
      <el-form label-width="130px" :model="form" :rules="rules" ref="serialRef">
        <el-row style="margin-bottom: 5px">
          <el-col :span="22">
            <p class="pinformation">基础信息</p>
          </el-col>
          <el-col :span="2">
            <el-button type="success" size="small" @click="submitForm(false)">保存</el-button>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="编号名称：" prop="serialName">
              <el-input clearable v-model="form.serialName" placeholder="请输入编号名称" />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="应用场景：" prop="typeId">
              <el-select style="width: 100%" v-model="form.typeId" placeholder="请选择应用场景" clearable filterable>
                <el-option v-for="dict in sys_code_apply" :key="dict.value" :label="dict.label"
                  :value="parseInt(dict.value)" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="引用其他编号：" prop="isRel">
              <el-row>
                <el-radio v-model="form.isRel" :label="0">否</el-radio>
                <el-radio v-model="form.isRel" :label="1">是</el-radio>
                <el-radio v-model="form.isRel" :label="2">同类型的原样编号</el-radio>
              </el-row>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="引用编号：" prop="relId" v-if="form.isRel == 1">
              <el-select v-model="form.relId" placeholder="请选择引用编号" filterable clearable style="width: 100%">
                <el-option v-for="item in serialList" :key="item.serialId" :label="item.serialName"
                  :value="item.serialId" />
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="编码规范文档：">
          <fileUpload v-model="form.fileList" :typeId="23" :groupId="form.serialId"
            :fileType='["doc", "docx", "xls", "xlsx", "ppt", "txt", "pdf"]' :autoUpload="true"></fileUpload>
        </el-form-item>
        <el-row v-if="form.isRel == 0">
          <p class="pinformation" style="margin-top: 8px">字段列表</p>
          <p class="totalStyle" style="margin-top: 5px">
            共 {{ serialConfigList.length }} 条数据
          </p>
          <el-form-item label="新增字段类型：" prop="configType">
            <el-select v-model="addSerialForm.configType" placeholder="请输入新增字段类型">
              <el-option v-for="dict in sys_config_type" :key="dict.value" :label="dict.label"
                :value="parseInt(dict.value)" />
            </el-select>
          </el-form-item>
          <el-row style="padding-bottom: 15px; margin-left: 20px">
            <el-button type="success" link icon="Plus" @click="addSerialButton">新增</el-button>
          </el-row>
          <span style="
              color: red;
              font-size: 14px;
              padding-top: 5px;
              margin-left: 10px;
            ">注：当前列表中须有流水号字段，否则无法生效。</span>
        </el-row>
        <el-table ref="subTableRef" :data="serialConfigList" v-if="form.isRel == 0">
          <el-table-column label="字段类型" align="center" prop="configType">
            <template #default="scope">
              <dict-tag :options="sys_config_type" :value="scope.row.configType" />
            </template>
          </el-table-column>
          <el-table-column label="字段名称" align="center" prop="configName" />
          <el-table-column label="最大位数" align="center" prop="maxLength" />
          <el-table-column label="补0" align="center" prop="addZero">
            <template #default="scope">{{
              !scope.row.addZero ? "否" : "是"
            }}</template>
          </el-table-column>
          <el-table-column label="自动/手动" align="center" prop="writeType">
            <template #default="scope">{{
              !scope.row.writeType ? "手动" : "自动"
            }}</template>
          </el-table-column>
          <el-table-column label="顺序" align="center" prop="orderNum" />
          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
            <template #default="scope">
              <el-button link type="success" @click="editSerialConfigList(scope.row.configId)">编辑</el-button>
              <el-button link type="success" @click="deleteSerialConfigList(scope.row.configId)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-row style="margin: 5px 0" v-if="form.isRel == 0">
          <el-col :span="2">
            <p class="pinformation" style="margin-top: 8px">编号预览</p>
          </el-col>
        </el-row>
        <onlinePreview :typeId="form.typeId" ref="onlinePreviewRef"
          v-if="(form.typeId === 0 || form.typeId) && form.isRel == 0"></onlinePreview>
      </el-form>

      <!-- 固定字段弹出框 -->
      <el-dialog :class="'el-dialog-theme3'" :title="title" v-model="gdzdOpen" append-to-body draggable
        :close-on-click-modal="false" @close="dialogClose">
        <el-form :model="addSerialForm" label-width="100px" :rules="dialogRules" ref="SerialFormRef">
          <el-form-item label="字段类型：">
            <dict-tag :options="sys_config_type" :value="addSerialForm.configType" />
          </el-form-item>
          <el-form-item label="字段名称：" prop="configName">
            <el-input clearable v-model="addSerialForm.configName" />
          </el-form-item>
          <el-form-item label="固定字符：">
            <el-input clearable v-model="addSerialForm.configValue" />
          </el-form-item>
          <el-form-item label="顺序号：">
            <el-input-number v-model="addSerialForm.orderNum" :min="0" controls-position="right" />
          </el-form-item>
        </el-form>
        <template #footer>
          <div class="dialog-footer">
            <el-button @click="save" type="success">保 存</el-button>
            <el-button @click="gdzdOpen = false" type="danger">关 闭</el-button>
          </div>
        </template>
      </el-dialog>

      <!-- 参数字段弹出框 -->
      <el-dialog :class="'el-dialog-theme3'" :title="title" v-model="paramOpen" append-to-body
        draggable :close-on-click-modal="false" @close="dialogClose">
        <el-form :model="addSerialForm" label-width="100px" :rules="dialogRules" ref="SerialFormRef">
          <el-form-item label="字段类型：">
            <dict-tag :options="sys_config_type" :value="addSerialForm.configType" />
          </el-form-item>
          <el-form-item label="参数名称：" prop="configName">
            <el-input clearable v-model="addSerialForm.configName" />
          </el-form-item>
          <el-form-item label="顺序号：">
            <el-input-number v-model="addSerialForm.orderNum" :min="0" controls-position="right" />
          </el-form-item>
        </el-form>
        <template #footer>
          <div class="dialog-footer">
            <el-button @click="save" type="success">保 存</el-button>
            <el-button @click="paramOpen = false" type="danger">关 闭</el-button>
          </div>
        </template>
      </el-dialog>

      <el-dialog :class="'el-dialog-theme3'" :title="title" v-model="sqlOpen" append-to-body draggable
        :close-on-click-modal="false" @close="dialogClose">
        <el-form :model="addSerialForm" label-width="100px" :rules="dialogRules" ref="SerialFormRef">
          <el-form-item label="字段类型：">
            <dict-tag :options="sys_config_type" :value="addSerialForm.configType" />
          </el-form-item>
          <el-form-item label="字段名称：" prop="configName">
            <el-input clearable v-model="addSerialForm.configName" />
          </el-form-item>
          <el-form-item label="SQL语句：" prop="configValue">
            <el-input clearable v-model="addSerialForm.configValue" />
          </el-form-item>
          <el-row>
            <el-col :span="8">
              <el-form-item label="字符数：">
                <el-input-number v-model="addSerialForm.maxLength" :min="0" controls-position="right" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="填报形式：">
                <el-radio-group v-model="addSerialForm.writeType">
                  <el-radio :label="0">手动</el-radio>
                  <el-radio :label="1">自动</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="顺序号：">
                <el-input-number v-model="addSerialForm.orderNum" :min="0" controls-position="right" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="前补0：">
                <el-radio-group v-model="addSerialForm.addZero">
                  <el-radio :label="0">否</el-radio>
                  <el-radio :label="1">是</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <template #footer>
          <div class="dialog-footer">
            <el-button @click="save" type="success">保 存</el-button>
            <el-button @click="sqlOpen = false" type="danger">关 闭</el-button>
          </div>
        </template>
      </el-dialog>

      <el-dialog :class="'el-dialog-theme3'" :title="title" v-model="zyzdOpen" append-to-body draggable
        :close-on-click-modal="false" @close="dialogClose">
        <el-form :model="addSerialForm" label-width="100px" :rules="dialogRules" ref="SerialFormRef">
          <el-form-item label="字段类型：">
            <dict-tag :options="sys_config_type" :value="addSerialForm.configType" />
          </el-form-item>
          <el-form-item label="字段名称：" prop="configName">
            <el-input clearable v-model="addSerialForm.configName" />
          </el-form-item>
          <el-row>
            <el-col :span="8">
              <el-form-item label="最大字符数：">
                <el-input-number v-model="addSerialForm.maxLength" :min="0" controls-position="right" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="前补0：">
                <el-radio-group v-model="addSerialForm.addZero">
                  <el-radio :label="0">否</el-radio>
                  <el-radio :label="1">是</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item label="顺序号：">
            <el-input-number v-model="addSerialForm.orderNum" :min="0" controls-position="right" />
          </el-form-item>
        </el-form>
        <template #footer>
          <div class="dialog-footer">
            <el-button @click="save" type="success">保 存</el-button>
            <el-button @click="zyzdOpen = false" type="danger">关 闭</el-button>
          </div>
        </template>
      </el-dialog>

      <el-dialog :class="'el-dialog-theme3'" :title="title" v-model="rqzdOpen" append-to-body draggable
        :close-on-click-modal="false" @close="dialogClose">
        <el-form :model="addSerialForm" label-width="100px" :rules="dialogRules" ref="SerialFormRef">
          <el-form-item label="字段类型：">
            <dict-tag :options="sys_config_type" :value="addSerialForm.configType" />
          </el-form-item>
          <el-form-item label="字段名称：" prop="configName">
            <el-input clearable v-model="addSerialForm.configName" />
          </el-form-item>
          <el-form-item>
            <template #label>
              <div style="font-size: 14px; color: red">提示：</div>
            </template>
            <div style="font-size: 14px; color: red">年YYYY月MM日DD</div>
          </el-form-item>
          <el-row>
            <el-col :span="8">
              <el-form-item label="填报形式：">
                <el-radio-group v-model="addSerialForm.writeType">
                  <el-radio :label="0">手动</el-radio>
                  <el-radio :label="1">自动</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="顺序号：">
                <el-input-number v-model="addSerialForm.orderNum" :min="0" controls-position="right" />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <template #footer>
          <div class="dialog-footer">
            <el-button @click="save" type="success">保 存</el-button>
            <el-button @click="rqzdOpen = false" type="danger">关 闭</el-button>
          </div>
        </template>
      </el-dialog>

      <el-dialog :class="'el-dialog-theme3'" :title="title" v-model="xzlbOpen" append-to-body draggable
        :close-on-click-modal="false" @close="dialogClose">
        <el-form :model="addSerialForm" label-width="100px" :rules="dialogRules" ref="SerialFormRef">
          <el-form-item label="字段类型：">
            <dict-tag :options="sys_config_type" :value="addSerialForm.configType" />
          </el-form-item>
          <el-form-item label="字段名称：" prop="configName">
            <el-input clearable v-model="addSerialForm.configName" />
          </el-form-item>
          <el-row>
            <el-col :span="14">
              <el-row style="margin-bottom: 5px">
                <p class="pinformation">选择字段列表</p>
                <p class="totalStyle">
                  共 {{ addSerialForm.sysSerialOptionList.length }} 条数据
                </p>
                <el-row style="padding-bottom: 5px; margin-left: 20px">
                  <el-button type="success" link icon="Plus" @click="addSysSerialOptionList">新增</el-button>
                  <el-button type="success" link>导出数据</el-button>
                  <el-button type="success" link>导出excel</el-button>
                </el-row>
              </el-row>
              <el-table :data="addSerialForm.sysSerialOptionList">
                <el-table-column label="含义" align="center" >
                  <template #default="scope">
                    <el-input clearable v-model="scope.row.label"></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="显示字符" align="center" width="100">
                  <template #default="scope">
                    <el-input clearable v-model="scope.row.value"></el-input>
                  </template>
                </el-table-column>
                <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="80">
                  <template #default="scope">
                    <el-button link type="success" icon="Delete" @click="handleDialogDelete(scope.$index)">删除</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </el-col>
            <el-col :span="10">
              <el-form-item label="最大字符数：">
                <el-input-number v-model="addSerialForm.maxLength" :min="0" controls-position="right" />
              </el-form-item>
              <el-form-item label="前补0：">
                <el-radio-group v-model="addSerialForm.addZero">
                  <el-radio :label="0">否</el-radio>
                  <el-radio :label="1">是</el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="顺序号：">
                <el-input-number v-model="addSerialForm.orderNum" :min="0" controls-position="right" />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <template #footer>
          <div class="dialog-footer">
            <el-button @click="save" type="success">保 存</el-button>
            <el-button @click="xzlbOpen = false" type="danger">关 闭</el-button>
          </div>
        </template>
      </el-dialog>

      <!-- 流水号弹出框 -->
      <el-dialog :class="'el-dialog-theme3'" :title="title" v-model="open" append-to-body draggable
        :close-on-click-modal="false" @close="dialogClose">
        <el-form :model="addSerialForm" label-width="100px" :rules="dialogRules" ref="SerialFormRef">
          <el-form-item label="字段类型：">
            <dict-tag :options="sys_config_type" :value="addSerialForm.configType" />
          </el-form-item>
          <el-form-item label="字段名称：" prop="configName">
            <el-input clearable v-model="addSerialForm.configName" />
          </el-form-item>
          <el-form-item label="流水规则：">
            <el-select v-model="addSerialForm.relConfigIds" placeholder="请输入流水规则" clearable style="width: 100%" multiple
              collapse-tags collapse-tags-tooltip :max-collapse-tags="3">
              <el-option v-for="item in serialConfigList" :key="item.configId" :label="item.configName"
                :value="item.configId" />
            </el-select>
          </el-form-item>
          <el-row>
            <el-col :span="8">
              <el-form-item label="最大字符数：">
                <el-input-number v-model="addSerialForm.maxLength" :min="0" controls-position="right" />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="前补0：">
                <el-radio-group v-model="addSerialForm.addZero">
                  <el-radio :label="0">否</el-radio>
                  <el-radio :label="1">是</el-radio>
                </el-radio-group>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="顺序号：">
                <el-input-number v-model="addSerialForm.orderNum" :min="0" controls-position="right" />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <template #footer>
          <div class="dialog-footer">
            <el-button @click="save" type="success">保 存</el-button>
            <el-button @click="open = false" type="danger">关 闭</el-button>
          </div>
        </template>
      </el-dialog>
    </el-card>
  </div>
</template>

<script setup name="Serial">
import {
  listSerial,
  getSerial,
  delSerial,
  delSerialConfig,
  getSerialConfigForm,
  addSerial,
  listSerialConfig,
  addSerialConfig,
  getOtherCode,
} from "@/api/system/serial";
import onlinePreview from "@/components/onlinePreview/index.vue";
import EditDict from "@/components/EditDict/editDistData";
const { proxy } = getCurrentInstance();

const { sys_code_apply, sys_config_type } = proxy.useDict(
  "sys_code_apply",
  "sys_config_type"
);

const loading = ref(true);
const EditDictRef = ref(null);
const ids = ref([]);
const multiple = ref(false);
const disabled = ref(false);
const total = ref(0);
const serialTable = ref([]);
const serialForm = ref({});
const highLightRow = ref(true);
const open = ref(false);
const gdzdOpen = ref(false);
const sqlOpen = ref(false);
const zyzdOpen = ref(false);
const rqzdOpen = ref(false);
const xzlbOpen = ref(false);
const paramOpen = ref(false);
const title = ref("");
const serialConfigList = ref([]);
const onlinePreviewRef = ref(null);

const data = reactive({
  form: { isRel: 0, fileList: [] },
  addSerialForm: {
    addZero: 0,
    configType: 0,
    orderNum: 1,
    sysSerialOptionList: [],
  },
  queryParams: {
    pageNum: 1,
    pageSize: 10,
    serialName: null,
    typeId: null,
    createUserId: null,
  },
  rules: {
    serialName: [
      { required: true, message: "编号名称不能为空", trigger: "blur" },
    ],
    typeId: [{ required: true, message: "应用场景不能为空", trigger: "blur" }],
    createUserId: [
      { required: true, message: "创建人不能为空", trigger: "blur" },
    ],
    createTime: [
      { required: true, message: "创建时间不能为空", trigger: "blur" },
    ],
    delFlag: [
      {
        required: true,
        message: "删除标识 0正常 1删除不能为空",
        trigger: "blur",
      },
    ],
  },
  dialogRules: {
    configName: [
      { required: true, message: "字段名称不能为空", trigger: "blur" },
    ],
    configValue: [
      { required: true, message: "sql语句不能为空", trigger: "blur" },
    ],
  },
});

const { queryParams, form, rules, addSerialForm, dialogRules } = toRefs(data);

/** 查询流水号配置列表 */
function getList() {
  loading.value = true;
  listSerial(queryParams.value).then((response) => {
    serialTable.value = response.rows;
    total.value = response.total;
    loading.value = false;
  });
}

// 表单重置
function reset() {
  form.value = {
    serialId: null,
    serialName: null,
    typeId: null,
    createUserId: null,
    createTime: null,
    delFlag: null,
    isRel: 0,
    fileList: []
  };
  proxy.resetForm("serialRef");
}

/** 搜索按钮操作 */
function handleQuery() {
  queryParams.value.pageNum = 1;
  getList();
}

/** 重置按钮操作 */
function resetQuery() {
  proxy.resetForm("queryRef");
  handleQuery();
}

// 多选框选中数据
function handleSelectionChange(selection) {
  ids.value = selection.map((item) => item.serialId);
  multiple.value = selection.length;
}

/** 修改按钮操作 */
function rowClick(row) {
  reset();
  const _serialId = row.serialId || ids.value;
  getSerial(_serialId).then((response) => {
    form.value = response.data;
    getSerialConfigList();
    heightBright.value = row.serialId;
    tableRowClass({ row });
  });
}

/** 提交按钮 */
function submitForm(isAuto) {
  return new Promise((resolve) => {
    proxy.$refs["serialRef"].validate((valid) => {
      if (valid) {

        addSerial(form.value).then((res) => {
          if (!isAuto) {
            proxy.$modal.msgSuccess(res.msg);
          }
          form.value.serialId = res.data;
          heightBright.value = res.data;
          getOtherCode().then((res) => {
            serialList.value = res.data;
          });
          getList();
          resolve();
        });
      }
    });
  });
}

/** 删除按钮操作 */
function handleDelete(row) {
  const _serialIds = row.serialId || ids.value;
  proxy.$modal
    .confirm('是否确认删除流水号配置编号为"' + _serialIds + '"的数据项？')
    .then(function () {
      return delSerial(_serialIds);
    })
    .then(() => {
      getList();
      handeleAdd();
      getOtherCode().then((res) => {
        serialList.value = res.data;
      });
      proxy.$modal.msgSuccess("删除成功");
    })
    .catch(() => { });
}

function save() {
  proxy.$refs["SerialFormRef"].validate((valid) => {
    if (valid) {
      addSerialForm.value.serialId = form.value.serialId;
      addSerialConfig(addSerialForm.value).then((res) => {
        isOpenClose();
        proxy.$modal.msgSuccess(res.msg);
        getSerialConfigList();
        onlinePreviewRef.value.reset();
        onlinePreviewRef.value.getList();
      });
    }
  });
}

function isOpenClose() {
  if (addSerialForm.value.configType == 0) {
    gdzdOpen.value = false;
  } else if (addSerialForm.value.configType == 1) {
    sqlOpen.value = false;
  } else if (addSerialForm.value.configType == 2) {
    zyzdOpen.value = false;
  } else if (addSerialForm.value.configType == 3) {
    rqzdOpen.value = false;
  } else if (addSerialForm.value.configType == 4) {
    xzlbOpen.value = false;
  } else if (addSerialForm.value.configType == 5) {
    open.value = false;
  } else if (addSerialForm.value.configType == 6) {
    paramOpen.value = false;
  }
}

function getSerialConfigList() {
  listSerialConfig({ serialId: form.value.serialId }).then((res) => {
    serialConfigList.value = res.data;
  });
}

function openTrue(val) {
  if (addSerialForm.value.configType == 0) {
    gdzdOpen.value = true;
    title.value = val + "固定字符";
  } else if (addSerialForm.value.configType == 1) {
    sqlOpen.value = true;
    title.value = val + "SQL字段";
  } else if (addSerialForm.value.configType == 2) {
    zyzdOpen.value = true;
    title.value = val + "自由字段";
  } else if (addSerialForm.value.configType == 3) {
    rqzdOpen.value = true;
    title.value = val + "日期字段";
  } else if (addSerialForm.value.configType == 4) {
    xzlbOpen.value = true;
    title.value = val + "选择字段";
  } else if (addSerialForm.value.configType == 5) {
    open.value = true;
    title.value = val + "流水号";
  } else if (addSerialForm.value.configType == 6) {
    paramOpen.value = true;
    title.value = val + "参数字段";
  }
}

function addSerialButton() {
  if (addSerialForm.value.configType === 5) {
    for (const item of serialConfigList.value) {
      if (item.configType == 5) {
        proxy.$modal.msgError("当前列表中已有流水号字段，无法重复添加");
        return false;
      }
    }
  }
  if (!form.value.serialId) {
    submitForm(true).then(() => {
      openTrue("新增");
    });
    return false;
  }
  openTrue("新增");
}

function deleteSerialConfigList(row) {
  proxy.$modal
    .confirm("是否确认删除此条数据项？")
    .then(function () {
      return delSerialConfig(row);
    })
    .then(() => {
      getSerialConfigList();
      proxy.$modal.msgSuccess("删除成功");
      onlinePreviewRef.value.reset();
      onlinePreviewRef.value.getList();
    })
    .catch(() => { });
}

function editSerialConfigList(row) {
  getSerialConfigForm(row).then((res) => {
    addSerialForm.value = res.data;
    openTrue("编辑");
  });
}

function handeleAdd() {
  serialConfigList.value = [];
  addSerialForm.value = {
    addZero: 0,
    configType: 0,
    sysSerialOptionList: [],
  };
  heightBright.value = "";
  form.value.fileList = []
  proxy.resetForm("serialRef");
  delete form.value.serialId;
}

function dialogClose() {
  addSerialForm.value = {
    addZero: 0,
    configType: 0,
    orderNum: 1,
    sysSerialOptionList: [],
  };
}

function addSysSerialOptionList() {
  addSerialForm.value.sysSerialOptionList.push({});
}

function handleDialogDelete(index) {
  proxy.$modal
    .confirm("是否确认删除此条数据项？")
    .then(function () {
      addSerialForm.value.sysSerialOptionList.splice(index, 1);
    })
    .then(() => {
      proxy.$modal.msgSuccess("删除成功");
    })
    .catch(() => { });
}

getList();

watch(
  () => total.value,
  () => {
    if (total.value) {
      heightParams.value = [
        { tableName: "main", bottomHeight: 74 },
        { tableName: "sub", bottomHeight: 150 },
      ];
    } else {
      heightParams.value = [
        { tableName: "main", bottomHeight: 21 },
        { tableName: "sub", bottomHeight: 150 },
      ];
    }
    getTableHeight();
  }
);

const heightParams = ref([
  { tableName: "main", bottomHeight: 21 },
  { tableName: "sub", bottomHeight: 180 },
]);
function getTableHeight() {
  proxy.adaptiveHeight(proxy, heightParams.value);
}
onMounted(() => {
  nextTick(() => {
    getTableHeight();
    window.addEventListener("resize", getTableHeight);
  });
});
onUpdated(() => {
  nextTick(function () {
    getTableHeight();
  });
});
onBeforeUnmount(() => {
  window.removeEventListener("resize", getTableHeight);
});

const heightBright = ref("");
function tableRowClass({ row }) {
  if (row) {
    if (row.serialId == heightBright.value) {
      return "current-row";
    }
    return "";
  }
}

getOtherCode().then((res) => {
  serialList.value = res.data;
});

const serialList = ref([]);
</script>
